*{
    margin: 0;
    padding: 0;
}
/* ***************头部导航***************************** */
.head{
    width: 100%;
    height: 70px;
    min-width: 1000px;  /*缩小窗口时，允许的最小宽度，若小于1000px,则出现水平滚动条*/
}

/* logo 部分 */
.head .logo{
    width: 20%;
    height: 100%;
    /* background-color: salmon; */
    float: left;
}
.head .logo a{
    display: block;
    width: 136px;
    height: 70px;
    /* background-color: yellow; */
    margin-left: 90px;
    
    background-size: contain;
    background: url(../images/kfc-logo-v2.svg) no-repeat;
}




.head .nav{
    width: 60%;
    height: 100%;
   
    float: left;
}

.head .login{
    width: 20%;
    height: 100%;
    /* background-color: yellow; */
    float: right;
}


/* ======中间导航部分======== */
.nav ul{
    width: 100%;
    height: 100%;
    list-style: none; /*去除小黑点*/
}

.nav ul li{
    float: left;  /*li不换行*/
    width: 90px;
    height: 100%;
    border-right: 1px solid white;  /*右边框*/
}

.nav ul li a{
    display: block;  /*改成块级元素，才能使得款高度有效*/
    width: 100%;
    height: 100%;
    text-decoration: none;  /*下划线去掉*/
   text-align: center;
   line-height: 58px;
   font-size: 14px;
   color: #333;
}

.nav ul li a:hover{  /*鼠标悬浮在超链接上，样式改变*/
    color: #e4002b;
}


/* 登录注册按钮 */
.login-btn{
    display: block;
    width: 60px;
    height: 30px;
    background-color:  #e4002b;
    float: left ; /*不换行*/
    margin-top: 14px;/*上间距*/
    margin-right: 20px;
    font-size: 12px;
    text-decoration: none; /*超链接下划线去除*/
    text-align: center;  /*文字水平居中*/
    line-height: 30px ; /*文字垂直居中  line-height = height*/
    color: white;
    border-radius: 4px; /*圆角*/
}


/* banner 横幅 */
.banner{
    width: 100%;
    height: 468px;
      background-size: cover;
    background-image: url(../images/hero-bd_01.jpg);
    background-repeat: no-repeat;
}

/* 秒杀部分 */
.secondkill{
    width: 85%;
    height: 540px;
    /* background-color: yellow; */
    margin: 0 auto;
    margin-top: 50px;
}

/* 秒杀左边标题部分 */
.secondkill .second-title{
    width: 30%;
    height:100% ;
    /* background-color: #ff9d00; */
    float: left;
}


.second-title h3{
    width: 100%;
    height: 100px;       
    font-size: 26px;
    text-align: center;
    line-height: 100px;
    color: rgb(63, 62, 62);
}

.second-title img{
    margin-left: 66px;
}

/* 秒杀右边商品列表部分 */
.secondkill .second-pro{
    width: 70%;
    height:100% ;
    /* background-color:seagreen; */
    float: right;
}

.second-pro ul{
    list-style: none;
}

.second-pro ul .pro-item{
    width: 200px;
    height: 260px;
    /* background-color: yellow; */
    float: left;  /*不换行*/
    margin-right: 40px;
    margin-bottom: 10px;
}

.second-pro ul .pro-item a{
    display: block;
    width: 100%;
    height: 100%;
    color: rgb(94, 93, 93);
    text-decoration: none; /*超链接下划线去除*/
}

.pro-item a img{
    width: 140px;
    height: 140px;
    margin-left: 30px;
}
.pro-item a p{
    width: 100%;
    height: 30px;    
    margin-top: 15px;
    font-size: 10px;  
   
    text-align: center;  line-height: 30px;
}

.pro-item a  .pro-price{
    color: #e4002b  ;
    font-weight: bold  ;  /*文字比重*/
}


/* *************热卖商品*************** */
.hot-pro{
    width: 85%;
    height: 500px;
    /* background-color: yellowgreen; */
    margin: 0 auto ; /*容器水平居中*/
    
}
.hot-pro-title{
   width: 100%;
   height: 80px;
   color: rgb(92, 92, 92);
   text-align: center;
   line-height: 80px;
   border-bottom: 1px solid gray;
}

.hot-pro .hot-pro-list{
    list-style: none;

}

.hot-pro .hot-pro-list li{
    width: 200px;
    height: 260px;
    /* background-color: yellow; */
    float: left;  /*不换行*/
    margin-right: 40px;
    margin-bottom: 10px;
}

.hot-pro .hot-pro-list li a{
    display: block;
    width: 100%;
    height: 100%;
    color: rgb(94, 93, 93);
    text-decoration: none; /*超链接下划线去除*/
}

.hot-pro-list a  img{
    width: 140px;
    height: 140px;
    margin-left: 30px;
}

.hot-pro-list a  p{
    width: 100%;
    height: 30px;    
    margin-top: 15px;
    font-size: 10px;  
   
    text-align: center;  line-height: 30px;
}